@alias {
	d: display;
	o: opcity;
	va: vertical-align;
	p: position;
	t: top;
	b: bottom;
	l: left;
	r: right;
	f: float;
	w: width;
	h: height;
	mw: min-width;
	mh: min-height;
	xw: max-width;
	xh: max-height;
	lh: line-height;
	m: margin;
	mt: margin-top;
	mb: margin-bottom;
	mr: margin-right;
	ml: margin-left;
	pd: padding;
	pt: padding-top;
	pb: padding-bottom;
	pr: padding-right;
	pl: padding-left;
	o: overflow;
	ox: overflow-x;
	oy: overflow-y;
	c: clear;
	bd: border;
	bdc:border-color;
	bt: border-top;
	bb: border-bottom;
	bbc: border-bottom-color;
	br: border-right;
	bl: border-left;
	bg: background;
	bgc: background-color;
	bgm: background-image;
	bgs: background-size;
	bgp: background-position;
	bgr: background-repeat;
	f: font;
	fs: font-size;
	fw: font-weight;
	radius: border-radius;
	ta:text-align;
	co:color;
	fl:flex;
}
/*! 清除默认样式 */
*{margin:0;padding:0;}
body{font-size:.28rem; margin:0 auto;color:#333;line-height:1.5;font-family: Arial,Verdana,Sans-serif;}
ul,ol,li,dl,dt,dd{list-style:none;float:none;}
h1,h2,h3,h4,h5,h6{font-weight:normal;}
img,table{border:0;border-collapse:collapse;border-spacing:0;}
img{vertical-align: middle;pointer-events: none;}
li{list-style: none;}
th{font-weight:normal;}
a{text-decoration:none; outline:0 none;}
em,i{font-style:normal;}
input,select,textarea{outline:none;}
input[type=radio],input[type=checkbox]{vertical-align:middle;}
input,button{border:0 none; outline:0 none;}
a{text-decoration: none;-webkit-tap-highlight-color: rgba(255,255,255,0); color: inherit;}
body>img{display: none;}
.hide{display:none;}

@mixin popup{
	lost-align:center;
    position: fixed 0;
    background-color: rgba(#000 ,.5);
    z-index: 99;
	
}
@mixin tips {
	/*! 【common组件】 tip  */
	.toastItem{display:none;width:100%;height:100%;background: rgba(0,0,0,0.5);position: fixed;left:0;top:0;z-index: 9999;}
	.toastItem .toastTip{width:100%;position: fixed;bottom:5%;left:0;text-align: center;}
	.toastItem .toastTip span{padding:8px 20px;border-radius:30px;color:#fff;background: #393939;}
}

@mixin radio($cl:#5086ff){
    /*! <span class="label"><input name="2" type="radio" checked><i></i>否</span> */
    .label{
    	position: relative;
        span{
            &::after{
                content: "";
                display: inline-block;
                width: 18px;
                height: 18px;
                border-top: 1px solid #b2b2b2;
                border-right: 1px solid #b2b2b2;
                transform: rotate(45deg);
                margin-left: 5px;
            }
        }
        i{
            position: relative;
            display: inline-block;
            vertical-align: -.08rem;
            width: 32px;
            height: 32px;
            border: 1px solid #c8c8c8;
            border-radius: 50%;
            margin-right: 8px;
        }
        input{
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            z-index: 1;
            &:checked ~ i{
                border-color: $cl;
                &::after{
                    content: "";
                    top: center;
                    left: center;
                    width: 20px;
                    height: 20px;
                    background-color: $cl;
                    border-radius: 50%;
                }
            }
        }
    }
}

@mixin checkbox($cl:#5086ff){
    /*! <span class="label"><input name="2" type="radio" checked><i></i>否</span> */
    .label{
    	position: relative;
        span{
            &::after{
                content: "";
                display: inline-block;
                width: 18px;
                height: 18px;
                border-top: 1px solid #b2b2b2;
                border-right: 1px solid #b2b2b2;
                transform: rotate(45deg);
                margin-left: 5px;
            }
        }
        i{
            position: relative;
            display: inline-block;
            vertical-align: -.08rem;
            width: 32px;
            height: 32px;
            border: 1px solid #c8c8c8;
            border-radius: 50%;
            margin-right: 8px;
        }
        input{
            display: block;
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            z-index: 1;
            &:checked ~ i{
                border-color: $cl;
                &::after{
                    position: absolute;
                    top: 8px;
                    left:6px;
                    transform: rotate(-41deg);
                    content: "";
                    width: 18px;
                    height: 8px;
                    border-bottom: 1px solid $cl;
                    border-left: 1px solid $cl;
                    border-color: $cl;
                }
            }
        }
    }
}

@mixin form{
    .form{
        &__label{
            display: flex;
            input,textarea{
                flex: 1;
                min-width: 1px;
            }
        }
    }
}

@mixin btn($lh: 88px,$fz:42px ,$cl:#fff){
    .btn{
        &-box{
            text-align: center;
        }
        &-block{
            width: 100%;
            border-radius: $lh;
            line-height: $lh;
            font-size: $fz;
            color: $cl;
            text-align: center;
        }
        &-xs{
            width: 420px;
            border-radius: $lh;
            line-height: $lh;
            font-size: $fz;
            color: $cl;
        }
    }
}

@mixin row(){
    .row{
        display: flex;
        align-items: stretch;
        justify-content: stretch;
        flex-wrap: wrap;
        .col{
            flex: auto;
        }
        @for $i from 1 through 12 {
            .col-#{$i} { 
                width: $i / 12 * 100%;
                flex: auto;
            }
        }
    }
}